{% load i18n %}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Successfully added {{ participant }}</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Pragma" content="no-cache" />
<style type="text/css" media="screen, tv, projection">
/*<![CDATA[*/

/* page styling, unimportant for the example. only makes the page looks nicer */
body {
	font-family: Calibri, "Trebuchet MS", sans-serif;
	font-size: 100%;
	color: #000;
	background: #f0ffe1;
}

.deadcentre {
	background: #d9ecc6;
	position:absolute;
	padding: 1em;
	top: 50%;
	left: 50%;
	width:80%;
	height:16.5em;
    margin-top: -9em; /*set to a negative number 1/2 of your height*/
	margin-left: -40%; /*set to a negative number 1/2 of your width*/
}

h1 {
    margin: 0;
    text-align: center;
}

.important {
    background: #fc8;
    font-size: 1.2em; 
    border-color: #f10;
    border-width: 2px;
    padding: 0.2em;
    border-style: dashed;
}

a {
    color: #5B80B2;
    font-weight: bold;
    font-size: 1.3em;
    text-decoration: none;
}

a:hover {
    color: #036;
    text-decoration: underline;
}

ul {
    margin-top: -0.7em;
}

/*]]>*/
</style>
</head>
<body>

<div class="deadcentre">
    <h1>{% blocktrans %}Successfully created a login account for {{ participant }}{% endblocktrans %}</h1>
    <p>{% blocktrans %}For {{ participant }} to login you must notify him of his username and password{% endblocktrans %}:
    <ul>
        <li>{% trans 'username' %}: <strong>{{ username }}</strong></li>
        <li>{% trans 'password' %}: <strong>{{ password }}</strong></li>
    </ul>
    </p>
    <p class="important">
        {% blocktrans %}<strong>Warning:</strong> This is the only time you'll be able to see his raw password (it's encrypted in the database for security reasons).{% endblocktrans %}
    </p>
    <p>
        <a href="../">{% blocktrans %}Yes, I have notified {{ participant }} of his username and password{% endblocktrans %}</a>
    </p>
</div>

</body>
</html>